import React from 'react';
import './index.less';
import bg from '../../assets/img/result/bg.png';
import failed from '../../assets/img/result/failed.png';
import success from '../../assets/img/result/success.png';
import star from '../../assets/img/result/star.png';
import star2 from '../../assets/img/result/star2.png';
import img from '../../assets/img/result/img.png';
import img2 from '../../assets/img/result/img2.png';
import connect from 'dva';

function Result({ status, data, title, index, name, master }) {
  console.log(data, 'data');
  return (
    <div className={'success'}>
      {/* <img className={'bg'} src={bg}></img>
      <img className={'circle'} src={status ? success : failed}></img> */}

      <div>
        <img className={'img'} src={(status && img) || img2}></img>
      </div>
      <div className={'status'}>
        <span>{(status && '验证通过') || '验证失败'}</span>
      </div>
      <div className={'textBox'}>
        <span className={'name'}>{name}</span>
        {!master && (
          <div style={{ color: '#5B1650', margin: '18px 0px' }}>
            <div>
              {data &&
                data.map((item, index) => {
                  return (
                    <span key={item.exhibID} style={{ fontWeight: 500 }}>
                      {item.exhibition.city}
                      {index != data.length - 1 && '、'}
                    </span>
                  );
                })}
            </div>
            <div>
              {data &&
                data.map((item, index) => {
                  return (
                    <span key={item.exhibID}>
                      {item.exhibition.city == '上海'
                        ? 'Shanghai'
                        : item.exhibition.city == '厦门'
                        ? 'Xiamen'
                        : 'Chengdu'}
                      {index != data.length - 1 && '、'}
                    </span>
                  );
                })}
            </div>
          </div>
        )}
        <span className={'index'}>
          {(status && (
            <span>
              {' '}
              * 该二维码已被扫码 <span style={{ color: 'red' }}>{index}</span> 次
            </span>
          )) || <span style={{ color: '#5B1650' }}>* 该用户位未报名该场{title}</span>}
        </span>
      </div>
      {/* <div className={'buttomBox'}>
        <button
          className={'buttom'}
          style={{
            backgroundImage:
              (status && 'linear-gradient( #691E5D, #501046)') ||
              'linear-gradient( #BABABA, #BABABA)',
          }}
          onClick={() => {
            if (status) {
              alert('已确认');
              return;
            }
            window.location.reload();
          }}
        >
          {(status && '确认通过') || '重新验票'}
        </button>
      </div> */}
    </div>
  );
}

export default Result;
